<template>
  <div class="interest">
    <h1>this is interest</h1>
    <div class="list">
      <div v-for="(item, index) in list"
      :key="index">
        <img src="" alt="">
        <h1>{{item.title}}</h1>
        <h2>{{item.display}}</h2>
      </div>
    </div>
  </div>
</template>
<script>
export default {
    name:'interest',
    data() {
      return {
        list:[
          {title:'趣味课程',desc:'通过动态简历的方式，介绍如何通过代码转换成浏览器的界面',
          pic:'http://by-image.oss-cn-shanghai.aliyuncs.com/Pre/resume/cover.gif'},
          {title:'预备课程',desc:'',
          pic:'http://by-image.oss-cn-shanghai.aliyuncs.com/Pre/drumkit/demo-2.gif'},
          {title:'t编程入门',desc:'',
          pic:'http://by-image.oss-cn-shanghai.aliyuncs.com/Pre/onoff/cover.gif'},
          {title:'this is interest',desc:'',
          pic:'http://by-image.oss-cn-shanghai.aliyuncs.com/Pre/bulletScreen/%E5%BC%B9%E5%B9%95.jpeg'},
          ]
      }
    },
}
</script>
<style lang="">
    /* .list{
      display:flex;
      flex-wrap: wrap;
    } */
</style>